<template>
	<!-- 医生--预约信息 -->
    <div>
      <div class="topBar">
        <h3>未来的预约行程</h3>
        <hr>
      </div>
      <div>
        <ul class="appointment_content content-list">
          
		  <li style="border-bottom: 1px solid black;font-size: 18px;font-weight: bold">
			  <span>病患姓名</span>
			  <span>预约时间</span>
		  </li>
		  <span v-if="appointment_lists.length==0" style="margin-left: 25%;list-style: none">今日没有预约！</span>
          <li style="font-size: 16px;font-weight: bold" v-for="(appointment,index) in appointment_lists" :key="index">
			  <span>{{appointment.pName}}</span>
			  <span>{{appointment.aTime}}</span>
          </li>
        </ul>
      </div>
    </div>
</template>

<script>
  import axios from 'axios'
  import api from '../../server/api'
  // import store from '../../vuex/store'
    export default {
        name: "AppointmentList",
        data(){
          return{
            appointment_list:[],
			appointment_lists:[]
          }
        },
        methods:{
         /* getAppointmentList(){
            let that=this;
            axios.get(api.doctorAppointmentList(store.state.username)).then((response)=> {
              if (response.data!=null) {
                that.appointment_list=response.data;
                console.log("查询被预约的时间");
              }
            })
          } */
		  getAppointmentList(){
		    let that=this;
		    axios.get(api.getPatientAppointments()).then((response)=> {
		        var nowTime=new Date();
				that.appointment_lists=[];
				var appointmentObj={
					cNo:'',
					pName:'',
					aTime:'',
					vNo:''
				}
				if (response.data!=null) {
					that.appointment_list=response.data;
				  for(let i=0; i<that.appointment_list.length;i++){
					  let theTime = new Date(that.appointment_list[i].aTime).getTime(); 
					  console.log("theTime: "+theTime);
					  console.log("nowTime: "+nowTime.getTime())
					  if((theTime-nowTime.getTime())>=0){
						  appointmentObj.cNo = that.appointment_list[i].cNo;
						  appointmentObj.pName = that.appointment_list[i].pName;
						  appointmentObj.aTime = that.appointment_list[i].aTime;
						  appointmentObj.vNo = that.appointment_list[i].vNo;
						  that.appointment_lists.push(appointmentObj);
					  }
				  }
					
		        console.log("查询被预约的时间");
		      }
		    })
		  }
		  
		  
        },
      mounted(){
          //挂载
          this.getAppointmentList();
      }
    }
</script>

<style scoped>
  .topBar{
    margin:0px 0px 15px 0px;
  }
  .topBar>hr{
    margin-top: 5px;
    height: 3px;
    background-color: #e8e8e8;
  }
  .appointment_content{
    /*border: 1px solid red;*/
    margin: 5px 0px;
    padding: 5px 25px;
    font-size: 14px;
  }
  .appointment_content>li{
    list-style-type:circle;
    line-height: 2em;
    padding: 0 25px;
  }
  .appointment_content:nth-of-type(even){
    background-color: silver;
  }
  
  
  .content-list>li{
    list-style: none;
    line-height: 2em;
    margin: 0;
  }
  .content-list>li:not(:first-child){
    line-height: 3em;
  }
  .content-list>li:nth-child(even){
    background-color: rgba(201,199,255,0.71);
  }
  .content-list>li>span{
    display: inline-block;
    width: 19%;
    /*border: 1px solid black;*/
    text-align: center;
  }
  .content-list>li>span>.mybtn{
    /*height: 25px;*/
    width: 75px;
  }
</style>
